<template>
    <div>
        <table>
            <tr>
                <td>id</td>
                <td>名字</td>
                <td>操作</td>
            </tr>
            <tr v-for="i in catelist">
                <td>{{i.id}}</td>
                <td>{{i.name}}</td>
                <td><button @click="del(i.id)">删除</button>
                    <button @click="update(i.id)">修改</button></td>
            </tr>
            <tr>
                <van-pagination
                            v-model="currentPage"
                            :total-items='total'
                            :items-per-page='3'
                            @change='getlist'
                            force-ellipses
                          />
            </tr>
        </table>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                catelist:[],
                currentPage:1,
                total:0
            }
        },
        methods:{
            //v形参，传递当前页数
        getlist(v){
            this.currentPage = v
            this.$axios.get('cateM?page='+v).then(res=>{
                this.catelist = res.data.list
                this.total = res.data.total
            })
        },
            del(id){
                this.$axios.delete('cateM?id='+id).then(res=>{
                    if(res.data.code==200){
                        alert('删除成功')
                        this.getcate(1)
                    }
                })
            },
            update(id){
                this.$router.push({path:'updatecate',query:{'id':id}})
            }
        },
        mounted(){
            this.getlist(1)
        }
        
    }
</script>

<style scoped>

</style>